// 历史信号弹窗
import { useState } from "react";
import SoftTypography from "components/SoftTypography";
import CustomModal from "components/CustomModal";

import Tooltip from "@mui/material/Tooltip";
import AccessTimeIcon from "@mui/icons-material/AccessTime";
import DataTable from "examples/Tables/DataTable";

export default function HistoryModal() {
  const [showModal, setShowModal] = useState(false);
  const openHistoryModal = () => {
    setShowModal(true);
  };
  const handleCancel = () => {
    setShowModal(false);
  };
  const dataTableData = {
    columns: [
      { Header: "Current Price", accessor: "currentPrice" },
      { Header: "Signal Price", accessor: "signalPrice" },
      { Header: "Action", accessor: "action" },
      { Header: "Signal Interval", accessor: "signalInterval" },
      {
        Header: "Signal Time",
        accessor: "signalTime",
      },
    ],
    rows: [
      {
        currentPrice: "$ 67008.67",
        signalPrice: "$10",
        action: "Buy",
        signalInterval: "12/04/2020",
        signalTime: "Delivered",
      },
      {
        currentPrice: "$ 67008.67",
        signalPrice: "$10",
        action: "Buy",
        signalInterval: "12/04/2020",
        signalTime: "Delivered",
      },

    ],
  };
  return (
    <>
      <SoftTypography variant="body1" color="secondary" sx={{ cursor: "pointer", lineHeight: 0 }}>
        <Tooltip title="History Signal" placement="top">
          <AccessTimeIcon fontSize="medium" onClick={openHistoryModal} />
        </Tooltip>
      </SoftTypography>

      <CustomModal width="800" title="History" open={showModal} onCancel={handleCancel}>
        <DataTable table={dataTableData} entriesPerPage={false} />
      </CustomModal>
    </>
  );
}
